.rate-wrapper{
        display: flex;
        width: 160px;
        height: 24px;
        .star{
                flex: 1;
                display: flex;
                margin: 0 4px;
                .item{
                        flex: 1;
                }
                &.on{
                        background: url("../../assets/picture/star36_on@3x.png") no-repeat center /24px auto;
                }
                &.half{
                        background: url("../../assets/picture/star36_half@3x.png") no-repeat center /24px auto;
                }
                &.off{
                        background: url("../../assets/picture/star36_off@3x.png") no-repeat center /24px auto;
                }
        }
        &.small{
                width: 80px;
                height: 12px;
                .star{
                        margin: 0 2px;
                        &.on{
                                background: url("../../assets/picture/star36_on@3x.png") no-repeat center /12px auto;
                        }
                        &.half{
                                background: url("../../assets/picture/star36_half@3x.png") no-repeat center /12px auto;
                        }
                        &.off{
                                background: url("../../assets/picture/star36_off@3x.png") no-repeat center /12px auto;
                        }
                }
        }
}
